<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="css/index.css" />
    <script src="js/jquery.js"></script>
    <script src="js/cookie.js"></script>
    <script src="js/ajax.js"></script>
    <script src="js/axios.js"></script>
    <script src="js/index.js"></script>
  </head>
  <body>
    <!-- 导航栏遮罩层 -->
    <div class="nav-top-shade">
      <!-- 导航栏版心 -->
      <div class="nav-top">
        <!-- 地区选择盒子 -->
        <div class="bigArea">
          <div class="area">
            <div class="border"></div>
            <div class="area-city">唐山市</div>
            <!-- 弹出层 -->
            <div class="chose">
              <p class="area-explain">请选择您所在的收货地区</p>
              <div class="area-tab">
                <ul class="area-title">
                  <li class="province area-item">省份</li>
                  <li class="city area-item">城市</li>
                </ul>
              </div>
              <div class="area-tab-body"></div>
              <a href="" class="chose-close">X</a>
            </div>
          </div>
        </div>
        <!-- 导航栏右边 -->
        <ul class="nav-right">
          <li class="wp-my">
            <ul class="head-log">
              <li class="wp-user">
                <span class="user-noid">
                  <a href="login.html">请登录</a>
                </span>
                <div class="user-infor">
                  <i class="user-border"></i>
                  <div class="top-nav-inf">
                    <span class="top-nav-pic-avatar"></span>
                    <div class="top-nav-pic-infs">
                      <p>
                        <a href="login.html">
                          <span>您好！</span>
                          <span>[请登录]</span>
                        </a>
                      </p>
                    </div>
                  </div>
                  <p class="top-nav-list">
                    <span><a href="">我的收藏</a></span>
                    <span><a href="">我的订单</a></span>
                    <span><a href="">零钱</a></span>
                    <span><a href="">我的优惠券</a></span>
                    <span><a href="">我的唯品币</a></span>
                    <span><a href="">唯品金融</a></span>
                  </p>
                </div>
                <div class="top-nav-i"></div>
              </li>
              <li class="regist">
                <a href="regist.html">注册</a>
                <div class="top-nav-i"></div>
              </li>
            </ul>
          </li>
          <!-- 签到有礼 -->
          <li class="wp-sign">
            <span>
              <i id="wp-sign-icon"></i>
              <span>签到有礼</span>
            </span>
            <div class="top-nav-i"></div>
          </li>
          <li class="wp-order">
            <span class="order-in">
              <a href="cart.html">我的订单</a>
            </span>
            <div class="top-nav-i"></div>
          </li>
          <li class="wp-service wp-fav-nav">
            <span class="service-in">
              <a href="#">我的特卖</a> <i class="icon-dis"></i
            ></span>
            <div class="service-infor fav-nav-drop">
              <i class="icon-border"></i>
              <p class="top-nav-list2">
                <span><a href="">商品收藏</a></span
                ><span><a href="">品牌收藏</a></span
                ><span><a href="">我的足迹</a></span>
              </p>
            </div>
            <div class="top-nav-i"></div>
          </li>
          <li class="wp-service wp-member">
            <span class="service-in">
              <a href="#">会员俱乐部</a>
              <i class="icon-dis"></i>
            </span>
            <div class="service-infor top-nav-dis">
              <i class="icon-border"> </i>
              <p class="top-nav-list2">
                <span><a href="#">俱乐部首页</a></span>
              </p>
            </div>
            <div class="top-nav-i"></div>
          </li>
          <li class="wp-service">
            <span class="service-in">
              客户服务
              <i class="icon-dis"></i>
            </span>
            <div class="service-infor top-nav-dis">
              <i class="icon-border"></i>
              <p class="top-nav-list2">
                <span><a href="#">联系客服</a></span
                ><span><a href="#">帮助中心</a></span
                ><span><a href="#">服务中心</a></span
                ><span><a href="#">知识产权保护</a></span>
              </p>
            </div>
            <div class="top-nav-i"></div>
          </li>
          <li class="wp-phone">
            <span class="phone-in">
              <a href="#">
                <i class="icon-mov"></i>
                手机版
              </a>
            </span>

            <div class="top-nav-i"></div>
          </li>
          <li class="wp-service wp-business">
            <span class="service-in">
              <a href="#">更多</a>
              <i class="icon-dis"></i>
            </span>
          </li>
        </ul>
      </div>
    </div>
    <!-- 导航栏LOGO -->
    <div class="head-logo">
      <div class="head-inner">
        <!-- 导航栏购物车 -->
        <div class="inner-cart">
          <div class="tool">
            <a href="cart.html">
              <span class="ico-bag"></span>
              <span class="my-cart">购物袋</span>
              <span class="cart-num">
                <span class="cart-count">0</span>
              </span>
            </a>
          </div>
          <div class="tool-cn">
            <div class="tool-cn-inner">
              <div class="tool-cn-in">
                <p>你得购物袋还没有商品再去逛逛把</p>
              </div>
            </div>
          </div>
        </div>
        <!-- 搜索区域 -->
        <div class="search">
          <!-- 搜索框 -->
          <div class="search-form">
            <input type="text" class="search-input" placeholder="女士T恤" />
            <a href="###" class="search-btn">
              <span class="search-icon"></span>
            </a>
          </div>
          <!-- 热搜索 -->
          <div class="search-hots">
            <ul class="search-hots-list">
              <li>
                <a href="//category.vip.com/suggest.php">儿童学习桌椅</a>
              </li>
              <li>
                <span>|</span>
                <a href="//category.vip.com/suggest.php">护肤套装</a>
              </li>
              <li>
                <span>|</span>
                <a href="//category.vip.com/suggest.php">鞋架</a>
              </li>
              <li>
                <span>|</span>
                <a href="//category.vip.com/suggest.php">水槽</a>
              </li>
              <li>
                <span>|</span>
                <a href="//category.vip.com/suggest.php">蓝色大衣</a>
              </li>
            </ul>
          </div>
        </div>
        <!-- 搜索左边logo -->
        <div class="search-logo">
          <div class="search-logo-dop">
            <a href="index.html">
              <img src="../images/pinpailogo.png" alt="" style="height: 100px"
            /></a>
          </div>
        </div>
        <div class="search-service">
          <img src="../images/zhengpin.jpg" alt="" />
        </div>
      </div>
    </div>
    <!-- 中心导航栏 -->
    <nav class="main-nav">
      <div class="main-nav">
        <div class="head-inner">
          <ul class="main-nav-link">
            <li class="main-nav-category">
              <a href="#" class="main-nav-atag">商品分类</a>
            </li>
            <li class="main-nav-list0">
              <a href="#" class="main-nav-atag nav-current">推荐</a>
            </li>
            <li class="main-nav-list1">
              <a href="#" class="main-nav-atag">3折疯抢</a>
            </li>
            <li class="main-nav-list2">
              <a href="#" class="main-nav-atag">唯品快抢</a>
            </li>
            <li class="main-nav-list3">
              <a href="#" class="main-nav-atag">唯品奢</a>
            </li>
            <li class="main-nav-list4">
              <a href="#" class="main-nav-atag">女装</a>
            </li>
            <li class="main-nav-list5">
              <a href="#" class="main-nav-atag">鞋包</a>
            </li>
            <li class="main-nav-list6">
              <a href="#" class="main-nav-atag">运动</a>
            </li>
            <li class="main-nav-list7">
              <a href="#" class="main-nav-atag">电器</a>
            </li>
            <li class="main-nav-list8">
              <a href="#" class="main-nav-atag">美妆</a>
            </li>
            <li class="main-nav-list9">
              <a href="#" class="main-nav-atag">母婴</a>
            </li>
            <li class="main-nav-list10">
              <a href="#" class="main-nav-atag">男装</a>
            </li>
            <li class="main-nav-list11">
              <a href="#" class="main-nav-atag">内衣</a>
            </li>
            <li class="more-wrap">
              <a href="#" class="main-nav-atag"
                >更多
                <i></i>
              </a>
              <div class="channel-item-group">
                <div class="channel-item">
                  <a href="#" class="channel-more-itemlink">首饰</a>
                </div>
                <div class="channel-item">
                  <a href="#" class="channel-more-itemlink">百货</a>
                </div>
                <div class="channel-item">
                  <a href="#" class="channel-more-itemlink">家纺</a>
                </div>
                <div class="channel-item">
                  <a href="#" class="channel-more-itemlink">食品</a>
                </div>
              </div>
            </li>
          </ul>
          <!-- 商品分类 -->
          <div class="nav-category-data">
            <ul class="cate-menu">
              <li class="cate-menu-item">
                <span class="menu-item-tit">女装/男装/内衣</span>
              </li>
              <li class="cate-menu-item">
                <span class="menu-item-tit">女鞋/男鞋/箱包</span>
              </li>
              <li class="cate-menu-item">
                <span class="menu-item-tit">护肤彩妆/个护</span>
              </li>
              <li class="cate-menu-item">
                <span class="menu-item-tit">运动户外</span>
              </li>
              <li class="cate-menu-item">
                <span class="menu-item-tit">数码家电</span>
              </li>
              <li class="cate-menu-item">
                <span class="menu-item-tit">母婴童装</span>
              </li>
              <li class="cate-menu-item">
                <span class="menu-item-tit">手表配饰</span>
              </li>
              <li class="cate-menu-item">
                <span class="menu-item-tit">居家用品</span>
              </li>
              <li class="cate-menu-item">
                <span class="menu-item-tit">唯品生活</span>
              </li>
              <li class="cate-menu-item">
                <span class="menu-item-tit">医药健康</span>
              </li>
            </ul>
            <div class="cate-pop"></div>
          </div>
        </div>
      </div>
    </nav>
    <!-- 轮播图 -->
    <div class="banner-shade">
      <div class="banner-wrap">
        <div class="banner-con-wrq">
          <div class="banner-con">
            <ul class="banner-list">
              <li class="banner-list-item">
                <img src="images/banner1.jpg" alt="" />
              </li>
              <li class="banner-list-item">
                <img src="images/banner2.jpg" alt="" />
              </li>
            </ul>
            <span class="banner-btn-left arrows">
              <i>&lt;</i>
            </span>
            <span class="banner-btn-right arrows">
              <i>&gt;</i>
            </span>
          </div>
        </div>
        <div class="banner-trigger">
          <ul class="banner-trigger-btns">
            <li>清凉一夏 真丝裙219起</li>
            <li>斯凯奇 全场低至35元</li>
          </ul>
          <div class="banner-trigger-line"></div>
        </div>
      </div>
    </div>
    <div class="big-content">
      <div class="big-content-in">
        <div class="big-content-infor">
          <div class="content-infor-in">
            <img src="images/superdapai.jpg" alt="" />
            <img src="images/superdapai1.jpg" alt="" />
            <img src="images/superdapai2.jpg" alt="" />
            <img src="images/superdapai3.jpg" alt="" />
          </div>
        </div>
      </div>
      <div class="hot-content">
        <div class="hot-content-head">
          <img src="images/meiribikan.jpg" alt="" />
        </div>
        <div class="hot-content-main">
          <div class="hot-content-main-in">
            <div class="hot-content-main-infor">
              <div id="hot1">
                <div id="hot-11">
                  <img src="images/sanzhefengqiang.jpg" alt="" />
                  <img
                    src="images/sanzhefengqiang1.jpg"
                    alt=""
                    class="hot-photo"
                  />
                  <img src="images/white1.png" alt="" class="hot-white" />
                  <img src="images/guoke.png" alt="" class="hot-name" />
                  <span id="hot-total1" class="total"> 共344款 </span>
                  <span id="hot-price1" class="price">￥124</span>
                  <span class="special sale">特卖价</span>

                  <img
                    src="images/sanzhefengqiang1.jpg"
                    alt=""
                    class="hot-photo"
                  />
                  <img src="images/white1.png" alt="" class="hot-white" />
                  <img src="images/guoke.png" alt="" class="hot-name" />
                  <span id="hot-total2" class="total">共4745款</span>
                  <span id="hot-price2" class="price">￥58</span>
                  <span class="special sale1">特卖价</span>

                  <img
                    src="images/sanzhefengqiang1.jpg"
                    alt=""
                    class="hot-photo"
                  />
                  <img src="images/white1.png" alt="" class="hot-white" />
                  <img src="images/guoke.png" alt="" class="hot-name" />
                  <span id="hot-total3" class="total">共4745款</span>
                  <span id="hot-price3" class="price">￥58</span>
                  <span class="special sale2">特卖价</span>
                </div>
              </div>
              <div id="hot2">
                <div id="hot-22">
                  <img src="images/weipinkuaiqiang.jpg" alt="" />
                  <img src="images/三折疯抢.jpg" alt="" class="hot2-photo" />
                  <img src="images/white2.png" alt="" class="hot2-white" />
                  <img src="images/yashilandai.jpg" alt="" class="hot2-name" />
                  <span id="hot2-price" class="price">￥233</span>
                  <span class="special sale3">特卖价</span>
                  <img src="images/三折疯抢.jpg" alt="" class="hot2-photo" />
                  <img src="images/white2.png" alt="" class="hot2-white" />
                  <img src="images/yashilandai.jpg" alt="" class="hot2-name" />
                  <span id="hot2-price2" class="price">￥89</span>
                  <span class="special sale4">特卖价</span>
                  <img src="images/三折疯抢.jpg" alt="" class="hot2-photo" />
                  <img src="images/white2.png" alt="" class="hot2-white" />
                  <img src="images/yashilandai.jpg" alt="" class="hot2-name" />
                  <span id="hot2-price3" class="price">￥61</span>
                  <span class="special sale5">特卖价</span>
                </div>
              </div>
              <div id="hot3">
                <div id="hot-33">
                  <img src="images/jinrijiangjia.jpg" alt="" />
                  <img src="images/superhot.jpg" alt="" class="hot3-photo" />
                  <span id="hot3-price" class="price">￥135</span>
                  <span class="special sale6">特卖价</span>

                  <img src="images/superhot.jpg" alt="" class="hot3-photo" />
                  <span id="hot3-price2" class="price">￥135</span>
                  <span class="special sale7">特卖价</span>

                  <img src="images/superhot.jpg" alt="" class="hot3-photo" />
                  <span id="hot3-price3" class="price">￥135</span>
                  <span class="special sale8">特卖价</span>
                </div>
              </div>
              <div id="hot4">
                <div id="hot-44">
                  <img src="images/paihangbang.png" alt="" />
                  <img src="images/bang.jpg" alt="" class="hot4-photo" />
                  <img src="images/lianyiqun.jpg" alt="" class="hot4-name" />
                  <img src="images/hottop1.png" alt="" class="hot4-num" />
                  <span class="hot4-cloth sale9">连衣裙</span>
                  <img src="images/bang.jpg" alt="" class="hot4-photo" />
                  <img src="images/lianyiqun.jpg" alt="" class="hot4-name" />
                  <img src="images/hottop1.png" alt="" class="hot4-num" />
                  <span class="hot4-cloth sale10">连衣裙</span>
                  <img src="images/bang.jpg" alt="" class="hot4-photo" />
                  <img src="images/lianyiqun.jpg" alt="" class="hot4-name" />
                  <img src="images/hottop1.png" alt="" class="hot4-num" />
                  <span class="hot4-cloth sale11">连衣裙</span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- 瀑布流 -->
      <div class="water-fall">
        <div class="water-fall-in">
          <div class="water-fall-infor">
            <div class="water-fall-list">
              <div class="water-fall-list-item">
                <a href="#"
                  ><img src="images/langzi.jpg" alt="" />
                  <div class="water-fall-list-item-name">
                    <span class="water-fall-num">1.4</span>
                    <span class="water-fall-str">折起</span>
                    <span>朗姿女装专场</span>
                  </div></a
                >
              </div>
            </div>
            <div class="jiazaigengduo">加载更多</div>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>
